<template>
  <div>
    <h3>审批</h3>
    <myexecl></myexecl>
    <h3>存储桶</h3>
    <input type="file" ref="myfile" @change="myimg" />
    <img :src="url" alt="" />
    <h3>头像上传</h3>
    <imgupdate :imgUrl.sync="imgUrl"></imgupdate>
  </div>
</template>

<script>
import COS from 'cos-js-sdk-v5'
export default {
  data () {
    return {
      cos: null,
      url: '',
      imgUrl:'https://img2.baidu.com/it/u=2984264523,2074118250&fm=26&fmt=auto&gp=0.jpg'
    }
  },
  methods: {
    myimg () {
      const file = this.$refs.myfile.files[0]
      this.cos.putObject(
        {
          Bucket: 'renzhi0831-1307224155' /* 必须 */,
          Region: 'ap-nanjing' /* 存储桶所在地域，必须字段 */,
          Key: file.name /* 必须 */,
          StorageClass: 'STANDARD',
          Body: file, // 上传文件对象
          onProgress: progressData => {
            //  progressData:上传过程中的实时进度对象
            console.log(JSON.stringify(progressData))
          }
        },
        (err, data) => {
          // data:上传成功后的返回值
          // err:上传出错的错误信息
          console.log(err || data)
          this.url = 'http://' + data.Location
        }
      )
    }
  },
  created () {
    this.cos = new COS({
      SecretId: 'AKIDA8qITO3QWM7ctue7JF1WP4TcT3NQChwv', // 身份识别 ID
      SecretKey: 'kDPKyQcaLq42j9I9k47tOcZFfqkMhlyu' // 身份密钥
    })
  }
}
</script>

<style></style>
